<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>我的收藏 - eBusiness</title>
    <link rel="stylesheet" th:href="@{/css/style.css}">
    <script th:src="@{/js/jquery-3.6.0.min.js}"></script>
    <script th:src="@{/js/slider.js}"></script>
</head>
<body>
    <div th:replace="~{common/header :: header}"></div>

    <div class="slider-container">
        <div class="slides">
            <img th:src="@{/images/1.jpg}" alt="Slide 1" class="slide active">
            <img th:src="@{/images/2.png}" alt="Slide 2" class="slide">
            <img th:src="@{/images/3.png}" alt="Slide 3" class="slide">
        </div>
        <div class="navigation-arrows">
            <span class="prev-arrow">&#10094;</span>
            <span class="next-arrow">&#10095;</span>
        </div>
        <div class="pagination-dots">
            <span class="dot active" data-slide="0"></span>
            <span class="dot" data-slide="1"></span>
            <span class="dot" data-slide="2"></span>
        </div>
    </div>

    <div class="category-search-bar-container">
        <div class="main-nav">
            <ul>
                <li><a th:href="@{/index}">首页</a></li>
                <li th:each="type : ${goodsTypes}"><a th:href="@{/category(typeId=${type.id})}" th:text="${type.typename}"></a></li>
            </ul>
        </div>
        <div class="header-search">
            <form th:action="@{/search}" method="get">
                <input type="text" name="keyword" placeholder="请输入关键词" th:value="${keyword}">
                <button type="submit">搜索</button>
            </form>
        </div>
    </div>

    <div class="main-content">
        <h2>我的收藏</h2>
        <p th:if="${error}" style="color: red;" th:text="${error}"></p>
        <p th:if="${message}" style="color: green;" th:text="${message}"></p>
        
        <div th:if="${!#lists.isEmpty(favoritedGoods)}">
            <table class="favorites-table">
                <thead>
                    <tr>
                        <th>商品图片</th>
                        <th>商品名称</th>
                        <th>原价</th>
                        <th>现价</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    <tr th:each="favoriteEntry : ${favoritedGoods}">
                        <td>
                            <a th:href="@{/goodsDetail(id=${favoriteEntry.goods.id})}">
                                <img th:src="@{/images/{picture}(picture=${favoriteEntry.goods.gpicture})}" alt="商品图片" class="favorite-goods-image">
                            </a>
                        </td>
                        <td th:text="${favoriteEntry.goods.gname}"></td>
                        <td th:text="${favoriteEntry.goods.goprice}"></td>
                        <td th:text="${favoriteEntry.goods.grprice}"></td>
                        <td>
                            <form th:action="@{/removeFavorite}" method="post">
                                <input type="hidden" name="favoriteId" th:value="${favoriteEntry.focustableId}">
                                <button type="submit" class="remove-favorite-btn">移除收藏</button>
                            </form>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
        <p th:if="${#lists.isEmpty(favoritedGoods)}">您的收藏夹是空的。</p>
    </div>

    <div th:replace="~{common/footer :: footer}"></div>
</body>
</html> 